import React from 'react'
import PropTypes from 'prop-types'
import EventWrapper from '../../../imvc/components/EventWrapper'
import Connect from '../../../imvc/components/Connect'
import OuterClickWrapper from '../../../imvc/components/OuterClickWrapper'
import Input from '../../../imvc/components/Input'

export default function View({ state, handlers }) {
  return (
    <div>
      <EventWrapper
        as='strong'
        onClick='handleNumIncr'
      >
        View lists 列表页
      </EventWrapper>
      <br />
      <Input
        name="orders.1.name"
      />
      <br />
      <a href="/playground/lists/3">go to</a>
      <br />
      <OuterClickWrapper onClick={() => {console.log('outer click')}}>
        <pre style={{border: '1px solid red'}} onClick={() => {console.log('clicked pre')}}>
          {JSON.stringify(state, null, 2)}
        </pre>
      </OuterClickWrapper>
    </div>
  )
}

function Pre({ children }) {
  return <pre>{children}</pre>
}
